<template>
  <view>
    <view class="goods-list" v-if="goodsList.length > 0" @click="goDetail">
       <my-good v-for="(goods, i) in goodsList" :key="i" :goods="goods" :data-info="goods.goods_id"></my-good>
    </view>
  </view>
</template>

<script>
  import {getGoodsList} from '../../utils/api.js'
  export default {
    data() {
      return {
        queryobj:{
          query:"",
          cid:"",
          pagenum:1,
          pagesize:10
        },
        goodsList:[],
        total:0,
        showComplate:true
      };
    },
    onLoad(options){
      // options中可以拿到参数,整理参数
      this.queryobj.query = options.query || ""
      this.queryobj.cid = options.cid || ""
      // console.log(this.queryobj)
      // 获取商品列表数据
      this.getGoodsList()
    },
    // 上拉更新
    async onReachBottom(){
      if(this.goodsList.length >= this.total) {
        if(this.showComplate) {
          this.showComplate = false
          uni.$showMsg({title:'数据加载已完成！',icon:'none'})
        }
        return
      }
      this.queryobj.pagenum = this.queryobj.pagenum + 1
      // 重新获取数据
      await this.getGoodsList(this.queryobj)
    },
    // 下拉刷新
   async onPullDownRefresh(){
      try{
        // 重置数据
         this.queryobj.pagenum = 1
         this.goodsList = []
         // 重新获取数据
        await this.getGoodsList(this.queryobj)
      }finally{
        // 关闭下拉刷新
        uni.stopPullDownRefresh()
      }
    },
    methods:{
      async getGoodsList() {
        try{
          const{ data:{message} }= await getGoodsList(this.queryobj)
          // console.log(message);
          this.goodsList = [...this.goodsList,...message.goods]
          this.total = message.total
        }catch(e){
          //TODO handle the exception
        }
      }
    }
  }
</script>

<style lang="scss" scoped>
  
</style>
